<template>
	<view :style="$store.state.skin">
		<view style="background-color: #f2f2f2; min-height: 100vh">
			<section class="aui-content shop-withdrawals maidan_btn pt-top pd-foot" id="myform">
				<!--银行卡-->
				<!--        <div class="aui-content bankcard-wrap aui-margin-t-10 no_line with_class">
			            <ul class="aui-list aui-media-list">
			                <li class="aui-list-item aui-list-item-middle">
			                    <div class="aui-media-list-item-inner">
			                        <div class="aui-list-item-media aui-margin-r-10 bank-pic-box bank-cashier-CMB"
			                            style="display: none;"></div>
			                        <div class="aui-list-item-inner aui-list-item-arrow">
			                            <div class="aui-list-item-text">
			                                <div class="aui-list-item-title aui-font-size-14" id="bankName"></div>
			                            </div>
			                            <div class="aui-list-item-text" id="account"></div>
			                        </div>
			                    </div>
			                </li>
			            </ul>
			        </div> -->
				<!--银行卡 end-->
				<!--提现金额-->
				<div class="tixian-wrap aui-margin-t-10 with_class">
					<div class="tx-title">提现金额</div>
					<div class="tx-num-box">
						<i class="icon_rmb" style="top: 0"></i>
						<div class="tx-input-bnox" style="display: flex; align-items: center">
							<em style="margin-right: 20rpx">&yen;</em>
							<input type="number" v-model="money" style="height: 2.5625rem" placeholder="0.00" />
						</div>
					</div>
					<div class="aui-hr aui-clearfix"></div>
					<div class="tixian-tip-box">可提现余额{{ userinfo.account_balance }}元</div>
					<div class="tixian-tip-box"><span class="red" style="color: #000">提现说明：</span></div>
					<div class="tixian-tip-box">提现限额：单笔提现不能小于100元</div>
					<div class="tixian-tip-box">提现时间：工作日9:30-15:00</div>
					<div class="tixian-tip-box">到账时间：24小时之内到账，节假日顺延。</div>
				</div>
				<!--提现金额 end-->
				<div class="tixian-wrap aui-margin-t-10 with_class">
					<div class="tx-title">提现密码</div>
					<div class="tx-num-box">
						<i class="icon_rmb"></i>
						<div class="tx-input-bnox">
							<input type="password" v-model="password" style="height: 2.5625rem" placeholder="请输入提现密码" />
						</div>
					</div>
				</div>
				<div class="aui-content-padded">
					<div class="aui-btn aui-btn-danger aui-btn-block aui-btn-sm zdyColor" @click="submit()">确认提现</div>
				</div>
			</section>
		</view>
	</view>
</template>

<script>
import request from '@/api/request.js';
import webSocketMixin from '@/api/socket.js';
export default {
	mixins: [webSocketMixin],
	data() {
		return {
			money: '',

			password: '',
			cash: 0.01,
			userinfo: {
				account_balance: '0.00',
				account_freeze: false,
				cumulative_PL: '0.00',
				list: [],
				today_float_PL: '0.00',
				total_assets: 0.0,
				total_earnest_money: 0.0,
				total_float_PL: '0.00',
				total_market_value: '0.00'
			},
			socketTask: null
		};
	},
	onLoad() {
		this.getInfo(uni.getStorageSync('userData').token);
	},
	onShow() {
		// 设置导航栏颜色
		uni.setNavigationBarColor({
			frontColor: '#ffffff',
		    backgroundColor: this.$store.state.presentColor
		});
	},
	onUnload() {
		if (this.socketTask) {
			this.socketTask.close();
		}
	},
	methods: {
		submit() {
			if (Number(this.money) < 100) {
				uni.showToast({
					title: '提现金额不可少于100'
				});
				return;
			}

			request
				.post('/api/pay/withdrawal', {
					payPwd: this.password,
					money: this.money
				})
				.then((res) => {
					if (res.code == 1) {
						uni.showModal({
							title: '提现成功',
							content: '24小时之内到账，节假日顺延',
							showCancel: false,
							success: (res) => {
								if (res.confirm) {
									uni.navigateBack(1);
								}
							}
						});
					}
				});
		},
		async getInfo(token) {
			this.socketTask = await this.handleConnectWebSocket(`?type=asset&token=${token}`);
			this.socketTask.onMessage((res) => {
				let data = JSON.parse(res.data);
				console.log('提现', data);
				if (data.total_assets) {
					this.userinfo = data;
					uni.setStorageSync('assetData', data);
					if (this.socketTask) {
						this.socketTask.close();
					}
				}
			});

			// uni.connectSocket({
			// 	url: 'wss://api.icode2023.top/wss?type=asset&token='+token,
			// });
			// uni.onSocketMessage((res)=>{
			// 	if(JSON.parse(res.data).totalAssets){
			// 		this.userinfo =JSON.parse(res.data);
			// 		uni.setStorageSync('assetData',res.data)
			// 		  uni.closeSocket();
			// 	}
			// })
			// uni.onSocketOpen(function(res) {
			// 	console.log('WebSocket连接已打开！');
			// 	const data = {
			// 		type: 'asset'
			// 	};
			// 	const jsonData = JSON.stringify(data);

			// 	uni.sendSocketMessage({
			// 		data: jsonData,
			// 		success: function() {
			// 			console.log('信息发送成功');
			// 		},
			// 		fail: function() {
			// 			console.log('信息发送失败');
			// 		}
			// 	});
			// });
		}
	}
};
</script>

<style lang="scss">
#myform {
	padding: 20rpx;
	margin: 20rpx;
	background-color: #fff;
}
.tixian-tip-box {
	font-size: 24rpx;
	color: #999;
	margin-top: 20rpx;
}
.zdyColor {
	background-color: var(--nav-bg) !important;
}
</style>
